<template>
    <div>
        <el-table :data="users" border style="width: 100%" height=600>
            <el-table-column
                    fixed
                    prop="id"
                    label="id"
                    width="100">
            </el-table-column>
            <el-table-column
                    prop="userName"
                    label="username"
                    width="150">
            </el-table-column>
            <el-table-column
                    prop="password"
                    label="password"
                    width="200">
            </el-table-column>
            <el-table-column
                    prop="name"
                    label="name"
                    width="120">
            </el-table-column>
            <el-table-column
                    prop="age"
                    label="age"
                    width="100">
            </el-table-column>
            <el-table-column
                    prop="email"
                    label="email"
                    width="200">
            </el-table-column>
<!--            <el-table-column-->
<!--                    label="操作"-->
<!--                    width="100">-->
<!--                <template slot-scope="scope">-->
<!--                    <el-button @click="handleClick(scope.row)" type="text" size="small">查看</el-button>-->
<!--                    <el-button type="text" size="small">编辑</el-button>-->
<!--                </template>-->
<!--            </el-table-column>-->
        </el-table>
        <el-pagination
                background
                layout="prev, pager, next"
                page-size="4"
                :total="totals"
                @current-change="page">
        </el-pagination>
    </div>
</template>

<script>
    export default {
        name: "Browse",
        methods: {
            handleClick(row) {
                console.log(row);
            },
            page(currentPage){
                const _this = this;
                axios.get('http://localhost:8081/user/show/page?page='+currentPage+'&size=5').then(function (response) {
                    _this.users=response.data.records;
                    _this.totals=response.data.total;
                })
            }
        },
        created() {
            const _this = this
            axios.get('http://localhost:8081/user/show/page?page=1&size=5').then(function (response) {
                _this.users=response.data.records;
                _this.totals=response.data.total;
                //console.log(response.data)
            })
        },
        data(){
            return{
                totals:0,
                users:[]
            }
        }
    }
</script>